﻿<!doctype html>
<html>
<head>
<#include "/part_meta.ftl">
<title>我的订单-迈小众</title>
<link href="${st.resDomain}/css/style.css" rel="stylesheet" type="text/css">
<link href="${st.resDomain}/css/store.css" rel="stylesheet" type="text/css">
<link href="${st.resDomain}/css/autostyle.css" rel="stylesheet" type="text/css">
<link href="${st.resDomain}/css/MyCenter.css" rel="stylesheet" type="text/css">
<style>
header .store .tab a { width: 25%;}
body {
	background-color: #EAF0F2;
}
</style>
</head>

<body>
<!--头部-->
<header>
  <div class="boxw store">
    <div class="header">
      <span class="f_left"><a href="javascript:history.back();" class="back"></a></span>
      <span class="title">我的订单</span>
      <span class="f_right"><a class="more"></a></span>
    </div>
    <div class="tab">
    	<a id="status_0">待配送</a>
    	<a id="status_2,4" class="selected">待收货</a>
    	<a id="status_1,3,5,6,7">已完成</a>
    	<a id="status_" >全部</a>
    </div>
    <div class="more">
      <a href="${st.userDomain}/shoppingCart" class="icon-car">购物车</a>
      <a href="${st.userDomain}/" class="icon-user">个人中心</a>
      <a href="${st.domain}/" class="icon-home">主页</a>
    </div>
  </div>
</header>
<!--头部 END-->

<div class="main boxw" style="padding-top:5rem;">
 <div id="dd"></div>
 <div id="loadTip" class="listTip">点击加载更多</div>
</div>
<script src="${st.resDomain}/scripts/jquery-1.9.1.min.js"></script>
<script src="${st.resDomain}/scripts/com.js"></script>
<script type="text/javascript">
var pagePath = g_userDomain + "/order/page";
var statusPath = g_userDomain + "/order/statusDo/json";
var delPath = g_userDomain + "/order/delDo/json";
var loadStatusEnumPath = g_userDomain + "/order/listStatus/json";
var $loadTip = $("#loadTip");
var statuses = null; 
var pageSize = 10;
loadStatus(function(result) {statuses = result});
loadPage(1);

function loadPage(num) {
	$loadTip.html("正在加载...").show();
	var statuses = ($("[id^='status_'].selected").attr("id").split("_"))[1];
	$.post(pagePath, {statuses: statuses, nowPage: num, pageSize:pageSize}, function(data){
		$("#dd").append(data);// 显示到列表中
		$(document).trigger('showimg');// 显示图片显示
		$ctrls = $("[id^='ctrl_']:empty");
		// 显示各订单操作按钮
		$ctrls.each(function() {
			showCtrl($(this), $(this).attr("id").split("_")[2]);
		});
		// 表示还有下一页
		if ($ctrls.length == pageSize) {
			$loadTip.html("点击加载更多");
			$loadTip.one('click', function() {
				loadPage(num + 1);
			});
		} else if ($("[id^='ctrl_']").length == 0) {
			$loadTip.html("没有相关订单");
		} else {
			$loadTip.hide();
		}
		
	},'html');
}

// 事件：点击切换选项卡
$("[id^='status_']").click(function(){
	$("[id^='status_']").removeClass("selected");
	$(this).addClass("selected");
	$("[id^='item_']").remove();
	loadPage(1);
});

// 订单每个操作按钮事件
$(document).on('click', "[id^='ctrl_'] a", function(event) {
	var $target = $(event.currentTarget);
	var params = $(this).attr("id").split("_");
	if (params[2]  == "s") {// 修改状态
		upStatus(params[1], params[3], $target);
	} else if (params[2]  == "d") {// 删除
		del(params[1]);
	} else if (params[2]  == "b") {// 再次购买
		//..
	} else if (params[2]  == "e") {// 评价
		//..
	}
	return false;
});

function showCtrl($ctrl, status) {
	var html = '';
	if (status == 0) {
		html += '<a id="s_1">取消订单</a>';
	} else if (status == 2 || status == 4) {
	    html += '<a id="s_3">确认收货</a><a id="s_5">退货</a>';
	} else if (status == 3) {
	    html += '<a id="b">再次购买</a><a id="e">评价</a>';
	} else if (status == 5) {
	    html += '<a id="s_">恢复</a>';
	}
	if (status == 1 || status == 3 || status == 6 || status == 7) {
		html += '<a id="d">删除</a>';
	}
	$ctrl.html(html);
	$ctrl.find("a").attr("href", "javascript:;");
	var orderCode = ($ctrl.attr("id").split("_"))[1];
	$ctrl.find("a").each(function() {
		$(this).attr("id", "ctrlBt_" + orderCode + "_" + $(this).attr("id"))
	});
}

function doing(bool) {
	if (bool == undefined) {
		return $(document).data("doing");
	}
	return $(document).data("doing", bool);
}

function upStatus(orderCode, status, $target) {
	if (doing()) return; 
	if (parseInt(status) == 1) {
		if (confirm("确定要取消订单吗？")) {
			upDo_();
		}
	} else {
		upDo_();
	}

	function upDo_() {
		doing(true);
		showMsg("正在" + $target.html() +  "...", 'load');
		var $ctrl = $("[id^='ctrl_" + orderCode + "']");
		var $item = $("#item_" + orderCode).fadeTo(null,0.1);
		
		var statusName = null;
		if (statuses[status]) {
			statusName = statuses[status].name;
		}
		$.post(statusPath, {orderCode: orderCode, status:statusName}, function(data) {
			if (data.status !== 0) {
				showMsg(data.message, 'error');
				doing(false);
				$item.fadeTo('fast',1);
				return;
			}
			showMsg("操作成功", 'ok');
			$item.fadeTo('fast',0.1,function() {
				doing(false);
				showCtrl($ctrl, data.result.ordinal);
				$("#statusText_" + orderCode)
					.attr("class", "n" + data.result.ordinal)
					.html(data.result.memberText);
				$(this).fadeTo(null,1);
			});
		});
		
	}
}

function del(orderCode) {
	if (doing() || !confirm("确定要删除订单吗？")) return; 
	doing(true);
	showMsg("正在删除...", 'load');	
	// 即将删除的包括地址行和商品列表行
	var $item = $("#item_" + orderCode).fadeTo(null,0.1);
	
	$.post(delPath, {orderCode: orderCode}, function(data) {
		doing(false);
		if (data.status !== 0) {
			showMsg(data.message, 'error');
			$item.fadeTo('fast',1);
			return;
		}
		showMsg("删除成功", 'ok');
		$item.fadeOut(function(){$(this).remove();});
	});
}

function loadStatus(callback) {
	if (!localStorage.orderStatusList) {
		$.post(loadStatusEnumPath, function(data) {
			localStorage.orderStatusList = data;
			var obj = $.parseJSON(data);
			if (callback) callback(obj.result);
		}, 'text');
	} else {
		var obj = $.parseJSON(localStorage.orderStatusList);
		if (callback) callback(obj.result);
	}
}

</script>
</body>
</html>
